<template>
  <div id="top-toolbar">
    <el-row>
      <el-button type="primary" size="mini" v-for="(item, index) in buttonsObj" :key="index" @click="handleClick(item.oprType)">{{ item.text }}</el-button>
    </el-row>
  </div>
</template>

<script type='text/ecmascript-6'>
    export default {
      name: 'topToolbar',
      props: {
        buttonsObj: {
          type: Array,
          default: function () {
            return [
              { text: '新增', oprType: 'add' }
            ]
          }
        }
      },
      watchs: {
        buttonsObj: {
          handler: function (val) {
            this.buttonsObj = val
          },
          deep: true
        }
      },
      data () {
        return {}
      },
      methods: {
        handleClick (oprType) {
          this.$emit('operate', oprType)
        }
      },
      mounted () {},
      created () {}
    }
</script>
<style lang='stylus' rel='stylesheet/stylus' type="text/stylus">
  #top-toolbar
    padding 15px
    background #fff
</style>
